window.onload = function() {
	function AutoPlay() {
		var oLi = $("#list")[0].getElementsByTagName("li");

		function hidden() {
			for(var i = 0; i < oLi.length; i++) {
				oLi[i].className = "";
			}
		}
		var arrImg = ["img/Rendering/Banner1.jpg", "img/Rendering/Banner2.jpg", "img/Rendering/Banner3.jpg"];
		var timer = null;
		var n = 0;
		timer = setInterval(function() {
			n++;
			if(n > arrImg.length - 1) {
				n = 0;
			}
			$("#Rendering_top>img").attr("src", arrImg[n]);
			hidden();
			oLi[n].className = "active";
		}, 2000);
		for(var i = 0; i < oLi.length; i++) {
			oLi[i].index = i;
			oLi[i].onclick = function() {
				clearInterval(timer);
				hidden();
				this.cla;
				ssName = "active";
				var m = this.index;
				$("#Rendering_top>img").attr("src", arrImg[m]);
			};
		}
	}
	AutoPlay();
	//	瀑布流JS代码
	function ImgFalls() {
		var ArroImg = []; //图片数组
		//创建一个随机函数，获取图片路径   0-39之间的数
		function RandomNum(min, max) {
			var ArrNum = [];
			while(ArrNum.length < 39) {
				var num = parseInt(Math.random() * (max - min + 1) + min);
				if(ArrNum.indexOf(num) == -1) {
					ArrNum.push(num);
				}
			}
			return ArrNum;
		}
		//		图片加载
		function preLoadImg() {
			var NumArray = RandomNum(1, 39);
			for(var i = 0; i < NumArray.length; i++) {
				var aImg = $("<img />").attr("src", "img/Rendering/" + NumArray[i] + ".jpg");
				aImg.on("load", function() {
					ArroImg.push(this);
					if(ArroImg.length == NumArray.length) {
						//图片加载完成
						CreatLi();
						window.onresize = function() {
							CreatLi();
							fangbig_box.css({
								"opacity": "0.7",
							})
						}
					}
				})
			}
		}
		preLoadImg();
		//创建 li 标签
		function CreatLi(){
			var COUNT;
			var Left_margin;
			var left_img;
			var realWidth = (document.documentElement.clientWidth || document.body.clientWidth);
			var realHeight = (document.documentElement.clientHeight || document.body.clientHeight);
			if(realWidth < 480) {
				COUNT = 2;
				Left_margin = 0;
				left_img = 2.5;
			} else {
				COUNT = 4;
				Left_margin = 40;
				left_img = 5;
			}
			//每列的宽度 //共 列数
			$("#Rendering_content_list").width(realWidth - Left_margin);
			$("#Rendering_content_list").css({
				"marginLeft": Left_margin / 2 + "px"
			})
			var WIDTH = (realWidth - Left_margin) / COUNT;
			var recordHeight = []; //记录高度数组
			for(var i = 0; i < COUNT; i++) {
				recordHeight[i] = 0;
			}
			//找到每列高度中最小列的下标    
			var minHeightIndex = function() {
				var minIndex = 0;
				var min = recordHeight[0];
				var max = recordHeight[recordHeight.length - 1];
				for(var i = 0; i < recordHeight.length; i++) {
					if(min > recordHeight[i]) {
						min = recordHeight[i];
						minIndex = i;
					}
					//						寻找到最大高度
					if(max < recordHeight[i]) {
						max = recordHeight[i];
					}
				}
				$("#Rendering_content_list").height(max + 50);
				return minIndex;
			}
			for(var i = 0; i < 39; i++){
				var IndexMin = minHeightIndex();
				var aImg = ArroImg[i];
				aImg.style.width = WIDTH + "px";
				aImg.style.left = IndexMin * (WIDTH + left_img * 2) + left_img + "px";
				aImg.style.top = recordHeight[IndexMin] + left_img * 2 + "px";
				$("#Rendering_content_list").append($(aImg));
				recordHeight[IndexMin] += (aImg.offsetHeight + left_img * 2);
			}
			//移入事件

			fangbig_box = $("<div></div>");
			$("#Rendering_content_list").on("mouseover", function(event) {
					var ev = event || window.event;
					var Ele = ev.target;
					var EleSrc = Ele.getAttribute("src");
					var aa = typeof(EleSrc);
					//判断类型 undefined类型 string类型
					if(aa != "object") {
						var reg = /[0-3]?[0-9]/;
						Index = EleSrc.match(reg);
						var w = Ele.offsetWidth;
						var h = Ele.offsetHeight;
						var disX = Ele.offsetTop;
						var disY = Ele.offsetLeft;
						fangbig_box.attr("class", "fangda_big");
						fangbig_box.css({
							"display": "block",
							"opacity": "0.7",
							"width": w + "px",
							"height": h + "px",
							"top": disX + "px",
							"left": disY + "px"
						})
					}
					//添加标签
					$("#Rendering_content_list").append(fangbig_box);
					//点击事件
					fangbig_box.on("click", function() {
						var oImgb = new Image();		
						oImgb.onload=function(){
						$(".Img_box").append($(oImgb));
						$(".Img_box").css({
							"display": "block",
							"width": realWidth + "px",
							"height": realHeight + "px",
						});
						}
						oImgb.src = "img/Rendering/" + Index + "b.jpg";	
				})
				})
				//移出事件
			fangbig_box.on("mouseleave", function() {
				this.style.opacity = "0";
				$(this).hide();
			})
			$(".Img_box").on("click", function(event){
				var ev = event || window.event;
				ev.stopPropagation();
				$(".Img_box").html("");
				$(".Img_box").hide();
			})
		}

	}
	ImgFalls();
}